$(function () {
    $.ajax({
        type: "POST",
        url: "https://www.fastmock.site/mock/2884288cc500ff9afca7da8be8ba4ded/kang/data3",
        dataType:"json",
    })
        .then(function (res) {
            // 数据渲染
            gools(res.data1)
            // 选中筛选条件
            choose()
            // 分页器
            fenyeqi(res.data1)

            $(".lazy").lazyload();

        })

    // 分页器
    function fenyeqi(res) {
        $(".pagination").pagination(res.length, {
            callback: pageselect.bind(res),
            prev_text: "<<",
            next_text: ">>",
            num_edge_entries: 1,
            items_per_page: 20,
        });

    }

    var page_index = 0;

    function pageselect(inde) {
        page_index = inde
        gools(this)
    }
    // 数据渲染结构
    function gools(res) {
        goods_data = res
        var goolshtml = "";
        for (var i = page_index * 20; i < (page_index + 1) * 20; i++) {
            if (res[i] === undefined) { break };
            goolshtml += `<div>
            <a href="./details.html">
            <img class="lazy" data-original="${res[i].src}" src="${res[i].src}" alt="${res[i].alt}"></a>
            <h4>${res[i].alt}</h4>
            <p>${res[i].figureColor}</p>
            <span class="pire">￥${res[i].price}</span>
            <button data-id="${res[i].id}" class="s1">加入购物车</button>
            <button data-id="${res[i].id}" class="s2">立即购买</button>
        </div>`
        }
        $(".gools").html(goolshtml)

        goosid()

    }
    // 选中筛选条件
    function choose() {
        let $classification = $(".classification a")
        let $brand = $(".brand a")
        let $Theprice = $(".Theprice a")
        let $distance = $(".distance a")
        let $size = $(".size a")
        $classification.click(function () {
            var index = $classification.index($(this))
            $classification.eq(index).addClass("active")
                .siblings().removeClass("active")
        })
        $brand.click(function () {
            var index = $brand.index($(this))
            $brand.eq(index).addClass("active")
                .siblings().removeClass("active")
        })
        $Theprice.click(function () {
            var index = $Theprice.index($(this))
            $Theprice.eq(index).addClass("active")
                .siblings().removeClass("active");
            chooseprice(index)
        })
        $distance.click(function () {
            var index = $distance.index($(this))
            $distance.eq(index).addClass("active")
                .siblings().removeClass("active")
        })
        $size.click(function () {
            var index = $size.index($(this))
            $size.eq(index).addClass("active")
                .siblings().removeClass("active")
        })

    }
    // 价格删选
    function chooseprice(index) {
        var pire = [
            {
                "min": 0,
                "max": 99999999999999999
            },
            {
                "min": 599,
                "max": 999
            }, {
                "min": 1000,
                "max": 2999
            },
            {
                "min": 3000,
                "max": 4999
            },
            {
                "min": 5000,
                "max": 5999
            },
            {
                "min": 7000,
                "max": 8999
            },
            {
                "min": 9000,
                "max": 9999
            },
        ]
        $.ajax({
            type: "POST",
            url: "https://www.fastmock.site/mock/2884288cc500ff9afca7da8be8ba4ded/kang/data3",
        }).then(function (res) {
            // console.log(res);
            var foo = [];
            for (var i = 0; i < res.data1.length; i++) {
                if (res.data1[i].price >= pire[index].min && res.data1[i].price <= pire[index].max) {
                    foo.push(res.data1[i])
                }
            }
            fenyeqi(foo)
        })
    }


    // 选中商品id
    function goosid() {
        var $gools = $(".gools .s1")
        $gools.click(function () {
            var index = $gools.index($(this))
            var id = $gools.eq(index).attr("data-id")
            addCart(id)
        })
    }
    var goods_data = null
    // 获取cart信息 不会导致每次页面刷新获得空对象
    // 如果有数据返回数据  没有返回空对象
    var cart = (function () {
        if (localStorage.getItem("cart")) {
            var data = null;
            try {
                data = JSON.parse(localStorage.getItem("cart"))
            } catch (e) {
                data = {}
            }
            return data
        } else {
            return {}
        }
    })()
    // 储存商品数据
    function addCart(id) {
        if (id in cart) {
            cart[id].count++
        } else {
            goods_data[id].count = 1
            cart[id] = goods_data[id];
        }
        localStorage.setItem("cart", JSON.stringify(cart))

       alert("添加成功")
        
    }










})